import Vue from 'vue'
import App from './App.vue'
import router from './router'

// 路由守卫
router.beforeEach((to, from, next) => {

  // 3. 利用路由 meta 属性, 配置是否需要登录的选项
  // 如果要登录 needAuth == true
  if (to.meta.needAuth) {

  // 2. 将所有需要校验的页面提出来, 变成一个数组管理
  // 只需要判断 to.path 是否存在于数组中即可
  // const pageNeedAuth = [
  //   '/personal',
  //   '/edit'
  // ]
  // if (pageNeedAuth.indexOf(to.path) > -1) {

  // 1. 简单通过 or 形式判断目标页面, 太烦人
  // if (to.path == '/personal' || to.path=="/edit") {
    if (localStorage.getItem('token')) {
      next()
    } else {
      router.push('/login')
    }
  } else {
    next()
  }
})

// 引入 vant ui 库
// import Vant from 'vant'
// import 'vant/lib/index.css'
// Vue.use(Vant)
// 禁掉全局引入 vant ui 使用按需引入
import { Tabs, List, Uploader, Tab, Dialog, Field, ActionSheet } from 'vant';

Vue.use( Tabs )
Vue.use( Tab )
Vue.use( List )
Vue.use( Uploader )
Vue.use( Dialog )
Vue.use( Field )
Vue.use( ActionSheet )

import 'vant/lib/tabs/style'
import 'vant/lib/tab/style'
import 'vant/lib/list/style'
import 'vant/lib/uploader/style'
import 'vant/lib/dialog/style'
import 'vant/lib/field/style'
import 'vant/lib/action-sheet/style'

// 引入 axios 请求库
import axios from 'axios'
axios.defaults.baseURL = "http://157.122.54.189:9083"
// axios.defaults.baseURL = "http://127.0.0.1:3000"

import { Toast } from 'vant'
// 请求拦截器
// 每次用 axios 发出请求, 都会被拦截
// 验证一下有没有 token
axios.interceptors.request.use((config)=>{
  // 每个被拦截德尔请求, 都可以在这个回调收到当前请求配置 作为参数
  console.log(config);
  // 1. 如果 headers 没有带上 Authorization
  // 2. 如果 localStorage 存在 token 
  // 就要强制给他带上
  if (!config.headers.Authorization && localStorage.getItem('token')) {
    config.headers.Authorization = "Bearer " + localStorage.getItem( 'token' )
  }
  // 记得处理完需要放行请求
  return config
})
// 响应拦截器
axios.interceptors.response.use((res) => {
  const reg = /^4\d{2}$/
  if (reg.test(res.data.statusCode)) {
    Toast.fail(res.data.message)
  }

  if ( res.data.message == '用户信息验证失败' ){
    localStorage.clear()
    router.replace( '/login' )
  }
  return res
}) 

Vue.prototype.$axios = axios

Vue.config.productionTip = false

new Vue({
  router,
  render: function (h) { return h(App) }
}).$mount('#app')
